<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			table{
				border:red;
			}
		</style>
	</head>
	<body>
<table width="80%" border="1" cellpadding="1" cellspacing="0">
	<thead>
		<tr>
			<th>序号</th>
			<th>姓名</th>
			<th>年龄</th>
			<th>性别</th>
			<th>爱好</th>
			<th>操作</th>
			<th>操作</th>
			<th>操作</th>
		</tr>
	</thead>
  <tbody>
    <tr>
      <td >1</td>
      <td >11</td>
      <td >1</td>
      <td >11</td>
      <td >11</td>
      <td ><button  onclick="moveUp(this)">上移</button></td>
      <td><button class="btn" onclick="delFun()">删除</button></td>
      <td ><button  onclick="moveDown(this)">下移</button></td>
    </tr>
    <tr>
      <td>2</td>
      <td>22</td>
      <td >1</td>
      <td >11</td>
      <td >1</td>
      <td ><button  onclick="moveUp(this)">上移</button></td>
      <td><button class="btn" onclick="delFun()">删除</button></td>
      <td ><button  onclick="moveDown(this)">下移</button></td>
    </tr>
    <tr>
      <td>3</td>
      <td>33</td>
      <td >1</td>
      <td >11</td>
      <td >1</td>
      <td ><button  onclick="moveUp(this)">上移</button></td>
      <td><button class="btn" onclick="delFun()">删除</button></td>
      <td ><button  onclick="moveDown(this)">下移</button></td>
    </tr>
    <tr>
      <td>4</td>
      <td>44</td>
      <td >1</td>
      <td >11</td>
      <td >1</td>
      <td ><button  onclick="moveUp(this)">上移</button></td>
      <td><button class="btn" onclick="delFun()">删除</button></td>
      <td ><button  onclick="moveDown(this)">下移</button></td>
    </tr>
    <tr>
      <td>5</td>
      <td>55</td>
      <td >1</td>
      <td >11</td>
      <td >1</td>
      <td ><button  onclick="moveUp(this)">上移</button></td>
      <td><button class="btn" onclick="delFun()">删除</button></td>
      <td ><button  onclick="moveDown(this)">下移</button></td>
    </tr>
  </tbody>
</table>
<script type="text/javascript">
<!--
function moveUp(btn){
	console.log("btn:",btn)
  var hang = btn.parentNode.parentNode;
 
  var _node = hang.previousSibling;
  console.log("_node:",_node)
  while(_node && _node.nodeType != 1){
    _node = _node.previousSibling;
  }
  if(_node){
    swapNode(hang,_node);
  }
}
function moveDown(btn){
  var hang = btn.parentNode.parentNode;
  
  var _node = hang.nextSibling;
  while(_node && _node.nodeType != 1){
    _node = _node.nextSibling;
  }
  if(_node){
    swapNode(hang,_node);
  }
}
function swapNode(node1,node2){
  
  var _parent = node1.parentNode;
  
  var _t1 = node1.nextSibling;
  var _t2 = node2.nextSibling;
  
  if(_t1)_parent.insertBefore(node2,_t1);
  else _parent.appendChild(node2);
  
  if(_t2)_parent.insertBefore(node1,_t2);
  else _parent.appendChild(node1);
}

</script>
</body>
</html>

